<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="shortcut icon" href="../static/images/local/校标.jpg" />
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
    <link rel="stylesheet" href="../static/layui/css/layui.css">
    <script src="../static/layui/layui.js" ></script>
    <link rel="stylesheet" href="../static/css/mySignIn.css">
    <meta charset="UTF-8">
    <title>个人信息</title>
</head>
<body>
<div class="box">
    <form class="layui-form" >
        <div class="a">
            <div class="layui-form-item">
                <label class="layui-form-label">手机号码</label>
                <div class="layui-input-inline">
                    <label for="phone"></label><input type="text" id="phone" name="phone" required lay-verify="required" placeholder="您的手机号码" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">密码</label>
                <div class="layui-input-inline">
                    <label for="password"></label><input type="text" id="password" name="password" required lay-verify="required" placeholder="您的密码" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">性别</label>
                <div class="layui-input-inline">
                    <label for="sex"></label><select name="8afr" id="sex" >
                    <option value="">保密</option>
                    <option value="男">男</option>
                    <option value="女">女</option>
                </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-inline">
                    <label for="username"></label><input type="text" id="username" name="username" required lay-verify="required" placeholder="您的用户名" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">邮箱</label>
                <div class="layui-input-inline">
                    <label for="email"></label><input type="email" id="email" name="u6dgp" placeholder="您的邮箱" autocomplete="off" class="layui-input" lay-verify="email">
                </div>
            </div>

                <div class="buttons">

                    <div class="button">
                    <button class="layui-btn  button"  lay-filter="formDemo" type="button" onclick="save()">更新信息</button>
                    <button class="layui-btn layui-btn-danger button"  lay-filter="formDemo" type="button" onclick="logOut()">注销账号</button>
                    </div>
            </div>
        </div>
    </form>
</div>
<script>
    const suffix=localStorage.getItem("suffix");
    const prefix=localStorage.getItem("prefix");
    if(sessionStorage.getItem("root")!=="1"&&sessionStorage.getItem("root")!=="0")
        {window.alert("请先登录!");window.location.href=prefix+"/logIn"+suffix;}
      let user=JSON.parse(sessionStorage.getItem("user"));
    const baseUrl=localStorage.getItem("baseUrl");
    let flag=0;
       while(true) {let password=prompt("涉及隐私信息，请输入密码验证身份","password");
           console.log(user.userPassword);
           console.log(password);
        if(password!==user.userPassword&&password!==null)
        {    console.log(111);
            console.log(user.userPassword);
            alert("密码错误，请重新输入!");}
        else if(password===null) {
            flag=1;
            // console.log("我是history");
            // window.history.back();
            break;
        }
       else break;}
    if(flag===1) window.history.back();
    layui.$('#username').val(user.userName)
    layui.$('#password').val(user.userPassword)
    layui.$('#email').val(user.userEmail)
    layui.$('#phone').val(user.userPhone)
    layui.$('#sex').val(user.sex)
    layui.$('#phone').attr("readonly","readonly")
    layui.$('#username').attr("readonly","readonly")
    // $('#author').attr("readonly","readonly")
    function check() {
        const username =document.getElementById("username").value;
        const password = document.getElementById("password").value;
        const email=document.getElementById("email").value;
        if ($.trim(username)===""){
            layer.alert("请输入用户名");
            return false;
        }
        if (username.length>=20){
            layer.alert("用户名格式错误");
            return false;
        }
        if ($.trim(password) === '' || $.trim(password).length<=0){
            layer.alert("密码不能为空");
            return false;
        }
        if (password.length>=20||/.*[\u4e00-\u9fa5]+.*$/.test(password)){
            layer.alert("密码格式错误");
            return false;
        }
        if(!(/^[\w_.]+@[\w-]+(\.[\w-]+)*\.[0-9a-zA-Z0]{2,6}$/).test(email)&&$.trim(email)!=="")
        {
            layer.alert("邮箱格式错误!");
            return false;
        }
        return true;
    }
    function save() {
        const user = {
            userPhone: JSON.parse(sessionStorage.getItem("user")).userPhone,
            userName: document.getElementById("username").value,
            userPassword: document.getElementById("password").value,
            sex: document.getElementById("sex").value,
            userEmail: document.getElementById("email").value,
            userRoot: 0,
        }
        layer.confirm('确定要更新个人信息吗?',function (index){
            if(check())
           {$.ajax(
                {
                    url: baseUrl+"/user/update_myself",
                    dataType: "json",
                    type: "post",
                    headers: {
                        'Content-Type': 'application/json;charset=utf-8'
                    },
                    data: JSON.stringify(user),
                    success: function (res) {
                        console.log(res)
                        if (res===1) {
                            layer.msg("更新成功")
                            sessionStorage.setItem("user",JSON.stringify(user));
                        }
                        else layer.msg("更新成功");
                    },
                    error: function () {
                        alert("服务器内部请求错误!");
                    }
                })}
            layer.close(index);
        })
    }
    function logOut(){
        layer.confirm('确定要注销吗？',function (index) {
            $.ajax(
                {
                    url: baseUrl+"/user/logout_myself",
                    dataType: "json",
                    type: "post",
                    headers: {
                        'Content-Type': 'application/json;charset=utf-8'
                    },
                    data: JSON.stringify(user),
                    success: function (res) {
                        console.log(res)
                        if (res) {
                            window.alert("注销成功,点击返回登录页面")
                            sessionStorage.removeItem("user");
                            window.parent.location.href=prefix+"/logIn"+suffix;
                        }
                        else layer.alert("注销失败!请联系管理员");
                    },
                    error: function () {
                        alert("服务器内部请求错误!");
                    }
                })
            layer.close(index);
        })
    }
</script>
</body>
</html>